﻿@using NTQOnlineExam.Services.Infrastructure.MVC
@model NTQOnlineExamFrontend.Models.ForgotPasswordModel


@using (Ajax.BeginForm("ForgotPassword", "Account", new { }, new AjaxOptions
{
    OnBegin = "ForgotPasswordClient.OnBegin",
    OnSuccess = "ForgotPasswordClient.OnSuccessed",
    OnFailure = "ForgotPasswordClient.OnFailed",
    HttpMethod = "Post"

}, new { @class = "form-inline" }))
{ 
   
    <div class="form-group">
        <label class="sr-only" for="Email">Email address</label>
        @Html.TextBoxFor(m => m.Email, new { @class = "form-control", placeholder = "Email" })
    </div>
    <button type="submit" class="btn btn-blue" id="forgotpassword-send">Send</button>
    
    <div class="info-board info-board-red error-panel clear-both" id="forgot-password-errorPanel">
        <button type="button" class="close">×</button>
        <ul>
            <li>An error occured when the system was resetting your password. Please make sure you entered correct email adress and try again. Or contact site administrator if you need help.</li>
        </ul>
    </div>
    <div id="forgot-password-successPanel" class="info-board info-board-blue info-panel clear-both">
        <button type="button" class="close">×</button>
        <ul>
            <li>Your request is successful. Please check your mail box for the next step.</li>
        </ul>
    </div>
}


<script type="text/javascript">
    $(document).ready(function () {
        $("#forgot-password-successPanel").hide();
        $("#forgot-password-errorPanel").hide();
    });

    var ForgotPasswordClient = new function () {
        this.Init = function () {
        };
        this.OnBegin = function () {
            $("#forgotpassword-send").text("Processing ...");
        };
        this.OnSuccessed = function (response) {
            $("#forgotpassword-send").text("Send");
            if (!response.IsError && response.Data.Success) {
                $("#forgot-password-errorPanel").hide();
                $("#forgot-password-successPanel").show();
            } else {
                $("#forgot-password-errorPanel").show();
                $("#forgot-password-successPanel").hide();
            }
        };

        this.OnFailed = function (jsonData) {
            $("#forgotpassword-send").text("Send");
            $("#forgot-password-errorPanel").show();
            $("#forgot-password-successPanel").hide();
        };


    };


</script>
